// --------------------获取分类，处理下拉框
$.ajax({
  url:'/my/category/list',
  success:function(res){
    let str=''
if(res.status===0){
  res.data.forEach(element=>{
    str+=` <option value="${element.id}">${element.name}</option>`
  })
  $('select[name=cate_id]').append(str)
  let form = layui.form
  // 因为表单是动态创建的，所以需要更新渲染，（下拉框、单选按钮、多选按钮都需要重新渲染）
  form.render('select')
}
  }
})

// ---------------------设置富文本编辑器(在js文件中)
initEditor()

// --------------------------封面图片处理
// ------------------------初始化剪裁框
let image = $('#image')
let option = {
  aspectRatio:400/280,
  preview: '.img-preview'
}
image.cropper(option)


// ---------------------------点击上传能够触发文件域的单击事件
$('button:contains("选择封面")').on('click',function(){
  $('#file').trigger('click')
})

// --------------------------------更换剪裁区的图片
$('#file').on('change',function(){
  if(this.files.length>0){
    let fileObj = this.files[0]
    let url = URL.createObjectURL(fileObj)
    image.cropper('replace',url)
  }
})

// -------------------点击添加
$('form').on('submit',function(e){
e.preventDefault()
let fd = new FormData(this)
// 单独处理content
fd.set('content', tinyMCE.activeEditor.getContent());
// 处理剪裁图片
let canvas = image.cropper('getCroppedCanvas', { width: 400, height: 280 });
canvas.toBlob(function (blob) {
  // 参数blob就是转换后的结果，我们把这个结果加到fd中
  fd.append('cover_img', blob);
  // 检查FormData对象中的数据，直接输入 fd 是看不到数据的，需要通过 forEach 遍历查看fd中的数据
  // fd.forEach((value, key) => {
  //   console.log(key, value);
  // });
  $.ajax({
    url: '/my/article/add',
    type: 'POST',
    data: fd,
    contentType: false,
    processData: false,
    success: function (res) {
      // console.log(res);
      if (res.status === 0) {
        layer.msg(res.message, { time: 1500 }, function () {
          // 提示1.5s后，跳转到文章列表页
          location.href = './list.html';
        })
      }
    }
  });
});
})